.worklist-filter-modal {
    cursor: pointer;

    // position: relative;
    .filtet-modal-hidden {
        display: none;
    }

    .filter-modal-show {
        display: block;
    }

    .worklist-filter-active {
        background-color: var(--tiklab-gray-400)
    }

    .worklist-filter-item {
        display: flex;
        align-items: center;
        border-radius: 4px;
        position: relative;
        height: 30px;
        cursor: pointer;
        padding: 0 3px;
    }

    .worklist-filter-item:hover {
        background-color: var(--tiklab-gray-400);
    }

    .filter-modal {
        width: 420px;
        height: 100vh;
        background-color: #fff;
        position: absolute;
        z-index: 3;
        border-radius: 4px;
        box-shadow: 0 3px 6px -4px rgb(0 0 0 / 12%), 0 6px 16px 0 rgb(0 0 0 / 8%), 0 9px 28px 8px rgb(0 0 0 / 5%)
    }

    .filter-modal-title {
        line-height: 32px;
        font-size: 15px;
        padding: 5px 15px;
        font-weight: var(--tiklab-font-weight-bold);
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
        align-items: center;
        border-bottom: 1px solid #f7f7f7;
        // .filter-modal-title-right {
        //     font-weight: normal;
        //     display: flex;
        //     align-items: center;
        //     gap: 10px;
        // }
    }
    .workitem-filter-height-buttom {
        display: flex;
        gap: 10px;
        justify-content: space-between;
        padding: 10px 15px 10px;
        .workitem-filter-height-botton {
            display: flex;
            gap: 10px;
            justify-content: flex-end;
            // padding: 10px 15px 10px;
        }
    }

    

    .height-filter {
        padding-top: 10px;

        .workitem-filter-height {
            padding: 0 15px;
            height: calc(100% - 115px);
            overflow: auto;
        }
    }
}